<!-- Copyright (C) 2011 Zen Liu -->

<html>
<head>

<script>
var allVideos = null;

var YBPM12TYPE_TXT = "txt";
var YBPM12TYPE_IMG = "img";
var YBPM12TYPE_EMBED = "embed";

function ybpm12videoObj(description, link, videoId, type)
{
   this.selected = false;
   this.link = link;
   this.videoId = videoId;
   this.type = type;

   if (YBPM12TYPE_TXT == type)
      this.description = description;
   else
      this.description = "{" + type + "} " + description;
}

function ybpm12sortVideoObjAsc(a, b)
{
   if (a.description < b.description)
      return -1;
   else if (a.description > b.description)
      return 1;
   else
      return 0;
}

function ybpm12loadVideosOfLinks(videos, links)
{
   var i;
   var aLink;
   var pos;
   var vid;
   var desc;
   var type;
   var yturl = "youtube.com/watch?v=";
   for (i in links)
   {
      aLink = links[i];

      if (aLink && aLink.href)
      {
         pos = aLink.href.indexOf(yturl);
         if (pos >= 0)
         {
            pos += yturl.length;

            vid = aLink.href.substr(pos, 11);

            if (vid && vid.length == 11)
            {
               // we have a youtube video id.

               desc = null;
               type = YBPM12TYPE_TXT;

               imgs = aLink.getElementsByTagName("img");

               if (imgs && imgs.length > 0)
               {
                  // get description from the img tags.

                  for (var j = 0; j < imgs.length; j++)
                  {
                     desc = imgs[j].getAttribute("title");
                     if (desc)
                     {
                        desc = desc.replace(/^\s+|\s+$/g, "");  // trim spaces.

                        if (desc.length > 0)
                           break;
                     }
                  }

                  if (!desc || desc.length == 0)
                  {
                     for (var k = 0; k < imgs.length; k++)
                     {
                        desc = imgs[k].getAttribute("alt");
                        if (desc)
                        {
                           desc = desc.replace(/^\s+|\s+$/g, ""); // trim

                           if (desc.length > 0)
                              break;
                        }
                     }
                  }

                  if (!desc || desc.length == 0 || "Thumbnail" == desc)
                  {
                     desc = "[Video ID: " + vid + "]";
                  }

                  type = YBPM12TYPE_IMG;
               }
               else
               {
                  // it is probably a text node.

                  desc = aLink.innerHTML;
                  desc = desc.replace(/(<([^>]+)>)/ig, "");  // remove tags.
                  desc = desc.replace(/^\s+|\s+$/g, "");  // trim spaces.
               }

               if (!desc || desc.length == 0)
               {
                  // should not reach here?
                  desc = "{vid} " + vid;
               }

               videos.push(
                     new ybpm12videoObj(desc, aLink.href, vid, type));
            }
         }
      }
   }

}

function ybpm12loadEmbedVideo(videos, videoUrl, idx)
{
   var yturl = "youtube.com/v/";

   var pos = videoUrl.indexOf(yturl);
   if (pos >= 0)
   {
      pos += yturl.length;

      var vid = videoUrl.substr(pos, 11);

      if (vid && vid.length == 11)
      {
         // we have a youtube video id.

         var ii = idx + 1;

         var desc = "";

         if (ii < 10)
            desc = "[Video 0" + ii + " ID: " + vid + "]";
         else
            desc = "[Video " + ii + " ID: " + vid + "]";

         var type = YBPM12TYPE_EMBED;

         videos.push(new ybpm12videoObj(desc, videoUrl, vid, type));
      }
   }
}

function ybpm12loadVideosOfEmbeds(videos, embeds)
{
   for (var i = 0; i < embeds.length; i++)
   {
      var anEmbed = embeds[i];

      if (anEmbed.src)
      {
         ybpm12loadEmbedVideo(videos, anEmbed.src, i);
      }
   }
}

function ybpm12loadVideosOfObjects(videos, objs)
{
   for (var i = 0; i < objs.length; i++)
   {
      var anEmbed = objs[i];

      if (anEmbed.data)
      {
         ybpm12loadEmbedVideo(videos, anEmbed.data, i);
      }
   }
}

function ybpm12loadVideos(doc)
{
   var links = doc.getElementsByTagName("a");
   var embeds = doc.getElementsByTagName("embed");
   var objs = doc.getElementsByTagName("object");

   if (links.length <= 0 && embeds.length <= 0 && objs.length <= 0)
   {
      return 0;
   }

   var allvdo = new Array();

   ybpm12loadVideosOfLinks(allvdo, links);

   ybpm12loadVideosOfEmbeds(allvdo, embeds);

   ybpm12loadVideosOfObjects(allvdo, objs);

   allvdo.sort(ybpm12sortVideoObjAsc);

   return allvdo;
}



function ybpm12showVideos(videos)
{
   var videoContainer = document.getElementById("videoContainer");

   var vdoTable = document.getElementById("videoListTable");
   if (vdoTable)
   {
      // remove old
      videoContainer.removeChild(vdoTable);
   }

   vdoTable = document.createElement("tbody");
   vdoTable.setAttribute("id", "videoListTable");

   videoContainer.appendChild(vdoTable);

   for (var i = 0; i < videos.length; i++)
   {
      var newTr = document.createElement("tr");

      var newTd1 = document.createElement("td");
      newTr.appendChild(newTd1);

      var newInput = document.createElement("input");
      newInput.setAttribute("type", "checkbox");
      newInput.setAttribute("name", "vd" + i);
      newInput.setAttribute("value", videos[i].link);

      if (videos[i].selected)
         newInput.setAttribute("checked", "checked");

      newTd1.appendChild(newInput);

      var newTd2 = document.createElement("td");
      newTr.appendChild(newTd2);

      var newText = document.createTextNode(videos[i].description);
      newTd2.appendChild(newText);

      vdoTable.appendChild(newTr);
   }
}

function ybpm12changeVideoGroup()
{
   var selectVdoGrpElmt = document.getElementById("selectVdoGroup");
   var selectedGrp = selectVdoGrpElmt.options[selectVdoGrpElmt.selectedIndex];

   var shownVideos = new Array();

   for (var i = 0; i < allVideos.length; i++)
   {
      if ("all" == selectedGrp.value ||
            selectedGrp.value == allVideos[i].type)
      {
         // wanted

         // add if not duplicate
         var isDuplicate = false;
         for (var j = 0; j < shownVideos.length; j++)
         {
            if (shownVideos[j].videoId == allVideos[i].videoId)
            {
               // found duplicate
               isDuplicate = true;

               var descOld = shownVideos[j].description;
               var descNew = allVideos[i].description;

               if ("{" == descOld.charAt(0) && "{" != descNew.charAt(0))
               {
                  // Old is from {img}, {vid}, {embed}
                  // New is from visible text
                  shownVideos[j] = allVideos[i];
               }
               else if (((("{" == descOld.charAt(0) && "{" == descNew.charAt(0)) && 
                           (descOld.substr(0, 5) == descNew.substr(0, 5))) ||
                     ("{" != descOld.charAt(0) && "{" != descNew.charAt(0))) &&
                  (descOld.length < descNew.length))
               {
                  // same group, use the long description one.
                  shownVideos[j] = allVideos[i];
               }

               break;
            }
         }

         if (!isDuplicate)
            shownVideos.push(allVideos[i]);
      }
   }

   ybpm12showVideos(shownVideos);
}


function ybpm12isSelected(trElmt)
{
   var tdElmt = trElmt.firstChild;

   if (tdElmt)
   {
      var inputElmt = tdElmt.firstChild;

      if (inputElmt.checked)
      {
         return true;
      }
   }

   return false;
}

function ybpm12moveUp()
{
   var vdoTable = document.getElementById("videoListTable");

   if (vdoTable)
   {
      var oneChild = vdoTable.firstChild;

      while (oneChild)
      {
         var nextChild = oneChild.nextSibling;

         if (!nextChild)
            break;

         if (ybpm12isSelected(nextChild) && !ybpm12isSelected(oneChild))
         {
            // switch
            vdoTable.removeChild(nextChild);
            vdoTable.insertBefore(nextChild, oneChild);
         }
         else
         {
            oneChild = nextChild;
         }
      }
   }
}


function ybpm12moveDown()
{
   var vdoTable = document.getElementById("videoListTable");

   if (vdoTable)
   {
      var oneChild = vdoTable.lastChild;

      while (oneChild)
      {
         var prevChild = oneChild.previousSibling;

         if (!prevChild)
            break;

         if (ybpm12isSelected(prevChild) && !ybpm12isSelected(oneChild))
         {
            // switch
            vdoTable.removeChild(oneChild);
            vdoTable.insertBefore(oneChild, prevChild);
         }
         else
         {
            oneChild = prevChild;
         }
      }
   }
}

function ybpm12selectAll()
{
   var frm = document.getElementById("selectfrm").elements;
   if (frm)
   {
      var num = frm.length;
      for (var i = 0; i < num; i++)
      {
         var vdo = frm[i];
         if (vdo.type && "checkbox" == vdo.type)
         {
            vdo.setAttribute("checked", "checked");
         }
      }
   }
}


function ybpm12clearAll()
{
   var frm = document.getElementById("selectfrm").elements;
   if (frm)
   {
      var num = frm.length;
      for (var i = 0; i < num; i++)
      {
         var vdo = frm[i];
         if (vdo.type && "checkbox" == vdo.type)
         {
            vdo.removeAttribute("checked");
         }
      }
   }
}


function ybpm12setup(doc, result)
{
   // inject the videos
   var input = doc.getElementById("videosList");
   input.value = result;

   // play it.
   var playbutton = doc.getElementById("playAllButton1");
   playbutton.click();

   // close the video selection dialog.
   close();
}


function ybpm12submitVideos(theForm)
{
   var result = "";
   var frm = theForm.elements;
   if (frm)
   {
      var num = frm.length;
      for (var i = 0; i < num; i++)
      {
         var vdo = frm[i];
         if (vdo && vdo.checked && vdo.value && vdo.value.length > 0)
         {
            result += vdo.value + "\n";
         }
      }

      var ybpWin = window.open("http://www.toptip.ca/p/youtube-bulk-player.html");
      var ybDoc = ybpWin.document;

      ybpWin.setTimeout(function() { ybpm12setup(ybDoc, result); }, 5000);
   }
}


function ybpm12noVideoMsg()
{
   // hide the form
   document.getElementById("selectfrm").style.display = "none";

   document.write("<center>");
   document.write("<br><br><br>No YouTube video on this page.<br><br>");
   document.write("<button type='button' onclick='window.close()'>OK</button>");
   document.write("</center>");
}

</script>

</head>

<body>

<form id="selectfrm"  style="margin:10px" onsubmit="ybpm12submitVideos(this);return false;">

Show video links: 
<select id="selectVdoGroup" onchange="ybpm12changeVideoGroup()">
   <option value="txt">with text descriptions</option>
   <option value="img">with image thumbnails</option>
   <option value="embed">with embeded videos</option>
   <option value="all" selected="selected">all of the above</option>
</select>

<br>

<p>Select the videos and click OK to play them:</p>

<table id="videoContainer" style="margin:20px;"></table>

<center>
   <button type="button" onclick="ybpm12moveUp()">Move Up</button>
   <button type="button" onclick="ybpm12moveDown()">Move Down</button>
   <br><br>
   <button type="button" onclick="ybpm12selectAll()">Select All</button>
   <button type="button" onclick="ybpm12clearAll()">Clear All</button>
   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   <input type="submit" value="OK" style="padding:0 20px;" />
   <input type="button" value="Cancel" onclick="window.close()" style="padding:0 20px;" />
</center>

<br>

</form>

<script>

var parentwin = external.menuArguments;
var doc = parentwin.document;

var allVideos = ybpm12loadVideos(doc);

if (allVideos && allVideos.length > 0)
   ybpm12changeVideoGroup(allVideos);
else
   ybpm12noVideoMsg();
         
</script>

</body>
</html>

